<template>
	<view>
		<view>
			<view class="topbg">
				<image class="mask" src="/static/mask.png"></image>
				<image class="logo" src="/static/logo.png"></image>
				<view class="title">您好，欢迎来到初见</view>
			</view>
		</view>
		<!-- 登录 -->
		<view class="lgoin">
			<view>登录</view>
			<input type="text" placeholder="账号" v-model="account" />
			<input type="password" placeholder="密码" v-model="password" />
			<button class="btn" @click="login">登录</button>
			<view v-if="shenqing == 1" @click="shenqingFn">申请成为茶艺师</view>
		</view>
	</view>
</template>

<script>
	import config from '@/config.js'
	let httpsUrl = config.app_url
	export default {
		data() {
			return {
				account: '',
				password: '',
				shenqing: 0
			};
		},
		onLoad() {
			this.switch();
		},

		methods: {
			// 申请成为茶艺师是否显示
			switch () {
				this.http('/api/aunt/ison', {}).then(res => {
					this.shenqing = res.data;
				});
			},
			// 申请成为茶艺师
			shenqingFn() {
				uni.navigateTo({
					url: '/pages/Apply/Apply'
				});
			},
			login() {
				const { account: mobile, password } = this
				uni.request({
					url: httpsUrl + '/login/login',
					data: {
						mobile,
						password
					},
					dataType: 'json',
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
					},
					success: ({ data: res }) => {
						const { code, msg } = res
						uni.showToast({
							icon: 'none',
							title: msg,
							duration: 1000
						})
						if (code !== 1) return
						// uni.setStorageSync('storeListId', res.data.store_ids.split(','));
						// 缓存店铺信息
						uni.setStorageSync('storeList', res.data.store_info);
						// 缓存tokne
						// console.log(res.data.token);
						uni.setStorageSync('token', res.data.token);
						// 缓存用户信息
						uni.setStorageSync('userinfo', res.data);
						setTimeout(() => {
							uni.reLaunch({
								url: '/pages/user/user'
							});
						}, 1500);
					},
					fail: (res) => {
						console.log(res, 'error');
					}
				})
			},
			loginHand() {
				this.https('/login/login', {
					mobile: this.account,
					password: this.password
				}).then(res => {
					console.log(res, 'resp');
					// 缓存店铺ID
					uni.setStorageSync('storeListId', res.data.store_ids.split(','));
					// // 缓存店铺信息
					uni.setStorageSync('storeList', res.data.store_info);
					// // 缓存tokne
					// // console.log(res.data.token);
					uni.setStorageSync('token', res.data.token);
					// // 缓存用户信息
					uni.setStorageSync('userinfo', res.data);
					uni.showToast({
						icon: 'none',
						title: res.msg
					});
					if (res.data.code !== 1) return
					// setTimeout(() => {
					// 	uni.reLaunch({
					// 		url: '../user/user'
					// 	});
					// }, 1500);
				});
			}
		}
	};
</script>

<style lang="scss">
	.topbg {
		width: 750rpx;
		height: 561rpx;
		position: relative;

		.logo {
			position: absolute;
			width: 108rpx;
			height: 108rpx;
			left: 48rpx;
			top: 138rpx;
		}

		.mask {
			width: 100%;
			height: 100%;
			position: absolute;
			inset: 0;
			z-index: -1;
		}
	}

	.title {
		// width: 352rpx;
		height: 168rpx;
		font-size: 44rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #0C0601;
		position: absolute;
		top: 268rpx;
		left: 40rpx;
		line-height: 84rpx;
	}

	.lgoin {
		position: absolute;
		top: 382rpx;
		width: 670rpx;
		height: 720rpx;
		background: #ffffff;
		box-shadow: 0px 0px 12rpx 0px rgba(189, 189, 189, 0.5);
		border-radius: 40rpx;
		margin: 0 auto;
		left: 40rpx;
		display: flex;
		flex-direction: column;
		align-items: center;

		input {
			width: 570rpx;
			height: 100rpx;
			background: #f1f3f6;
			border-radius: 16rpx;
			padding-left: 30rpx;
			padding-right: 30rpx;
			margin-bottom: 40rpx;
			line-height: 100rpx;
		}

		view {
			font-size: 40rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 700;
			color: #000000;
			margin: 60rpx 0rpx;
		}
	}

	.btn {
		width: 630rpx;
		height: 95rpx;
		background: #C5996A;
		border-radius: 16rpx;
		color: #fff;
		margin-top: 50rpx;
		font-size: 32rpx;
	}
</style>